<template>
	<view>
		<!-- 监听变量 operation 的变化，operation 发生改变时，调用 test 模块的 loadOperation 方法 -->
		<view :operation="operation" :change:operation="test.loadOperation">
			<!-- 调用 test 模块的 clicked 变量 -->
			test模块：{{test.clicked}}
		</view>
		<br />
		<view>您总共点击了 {{total}} 次</view>
		<br />
		<button @click="onClick">点击</button>
		<view id="box">
			盒子
		</view>
	</view>

</template>

<script>
	export default {
		data() {
			return {
				operation: true,
				total:0,
				
			}
		},
		methods: {
			onClick(e){
				let box = document.querySelector("#box")
				box.innerHTML="21323"
				this.operation = !this.operation
			},
			/**
			 * 接收 renderjs 传过来的数据
			 * @param {Object} data
			 */
			reciveMessage(data) {
				this.total = data;
			}
		}
	}
</script>
<script module="test" lang="renderjs">
	export default {
		data() {
			return {
				clicked: false,
				count: 0
			}
		},
		methods: {
			loadOperation(newValue, oldValue, ownerInstance, instance) {
				// 数据变更
				console.log(newValue,oldValue,ownerInstance,instance)
				this.clicked = newValue;

				// 向uni-app页面组件发送信息
				this.sendMsg();
			},
			sendMsg() {
				// 向页面传参
				this.$ownerInstance.callMethod('reciveMessage', ++this.count)
			},
		}
	}
</script>
<style>

</style>